import { aq, op } from '@uwdata/arquero'
species_filt = aq.table(serengeti)
  .filter(aq.escape(r => op.includes(species.category, r.Species)))
Plotly = require("https://cdn.plot.ly/plotly-latest.min.js")
categories = Object.values(speciesCats)
viewof species = Inputs.radio(
  categories,
  {
    value: categories[0],
    label: "Select species:",
    format: x => x.name
  }
)

variables = Object.values(contVars)
viewof contVar = Inputs.radio(
  variables,
  {
    value: variables[0], 
    label: "Select a Continuous Variable:",
    format: x => x.name
  }
)
{
  let data = [];
  for (var i = 0; i < species.category.length; i++) {
    data.push({
      y: species_filt.filter(aq.escape(r => r.Species === species.category[i])).reify().data()[contVar.variable].data,
      type: "box",
      name: species.category[i]
    })
  }
  const div = DOM.element('div');
  let layout = {
    title: "Species differences in Continuous Variables",
    yaxis: { title: contVar.name }
  };
  Plotly.newPlot(div, data, layout);
  return div;
}